<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        * {
            border: 0 none;
            padding: 0;
        }

        .txtdiv {
            width: 258px;
            height: 40px;
            margin: 100px auto;

        }

        .txt {
            width: 208px;
            height: 40px;
            background: url("images/left.jpg") no-repeat;
            list-style: none;
            float: left;
            color: blue;
            padding-left: 8px;
        }

        .bt {
            height: 40px;
            width: 42px;
            background: url("images/right.jpg") no-repeat;
            float: left;
            cursor: pointer;
        }
    </style>
    <script>

        function $(id) {
            return document.getElementById(id);
        }


        window.onload = function () {

            // alert($("txt"));
            $("txt").onfocus = function () {
                $("txt").value = "";
                $("txt").style.color = "green";
            }
            // $("txt").onblur = function () {
            //     $("txt").value = "请输入";
            //     $("txt").style.color = "red";
            // }
            // $("bt").onclick = function () {
            //     alert($("txt").value);
            //     $("txt").value = "请输入";
            // }

        }
        function btclick() {
            alert($("txt").value);
            $("txt").value = "请输入";
        }
    </script>
</head>
<body>
<div class="txtdiv">
    <input value="请输入.." class="txt" id="txt"/>
    <button class="bt" id="bt" onclick=" btclick">

    </button>
</div>
</body>
</html>